<template>
  <a-spin :spinning="confirmLoading">
    <j-form-container :disabled="formDisabled">
      <a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail">
        <a-row>
          <a-col :span="24" >
            <a-form-model-item label="姓名" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="staffName">
              <a-input v-model="model.staffName" placeholder="请输入姓名" :disabled="!openTypeAdd" ></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="24"  v-if="openTypeAdd">
            <a-form-model-item label="手机号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="staffPhone">
              <a-input v-model="model.staffPhone" placeholder="请输入手机号"  ></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="24" v-if="openTypeAdd">
            <a-form-model-item label="预计入职时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="planEntryTime">
              <j-date placeholder="请选择预计入职时间" v-model="model.planEntryTime"  style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24"  v-if="openTypeEntry||openTypeFormal">
            <a-form-model-item label="入职时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="entryTime">
              <j-date placeholder="请选择入职时间" v-model="model.entryTime"  style="width: 100%"  @change="staffTrialChange" :disabled="!openTypeEntry" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24" v-if="openTypeEntry">
            <a-form-model-item label="员工类型" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="staffType" >

              <j-dict-select-tag type="list" v-model="model.staffType" dictCode="staff_type" placeholder="请选择员工状态" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24"  v-if="openTypeEntry">
            <a-form-model-item label="员工状态" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="entryStatus">
              <j-dict-select-tag type="list" v-model="model.entryStatus" dictCode="entry_status" placeholder="请选择员工状态" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24"  v-if="(openTypeEntry||openTypeFormal )&& model.entryStatus==1">
            <a-form-model-item label="试用期" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="staffTrialType">
              <j-dict-select-tag type="list" v-model="model.staffTrialType" dictCode="staff_trial_type" :disabled="!openTypeEntry" placeholder="请选择试用期" @change="staffTrialChange" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24" v-if="(openTypeEntry||openTypeFormalTime||openTypeFormal) && model.entryStatus==1">
            <a-form-model-item label="计划转正时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="planFormalTime">
              <j-date placeholder="请选择计划转正时间" v-model="model.planFormalTime"  style="width: 100%"  :disabled="!openTypeFormalTime"/>
            </a-form-model-item>
          </a-col>
          <a-col :span="24" v-if="openTypeEntry||openTypeAdd">
            <a-form-model-item label="部门" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="staffDepartmentIds">
              <j-select-depart v-model="model.staffDepartmentIds" multi  />
            </a-form-model-item>
          </a-col>
          <a-col :span="24" v-if="openTypeEntry||openTypeAdd">
            <a-form-model-item label="职位" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="staffJob">
              <a-input v-model="model.staffJob" placeholder="请输入职位"  :aria-required="true"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="24" v-if="openTypeEntry">
            <a-form-model-item label="直接主管" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="staffLeader">
              <j-select-user-by-dep v-model="model.staffLeader" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24" v-if="openTypeEntry">
            <a-form-model-item label="办公地点" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="staffWorkAddress">
              <a-input v-model="model.staffWorkAddress" placeholder="请输入办公地点"  ></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="24" v-if="openTypeFormal">
            <a-form-model-item label="实际转正时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="realFormalTime">
              <j-date placeholder="请选择实际转正时间" v-model="model.realFormalTime"  style="width: 100%" />
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-form-model>
    </j-form-container>
  </a-spin>
</template>

<script>

  import { httpAction, getAction } from '@/api/manage'
  import { validateDuplicateValue } from '@/utils/util'
  import {dateFormat} from "@assets/tw/js/dateTime";

  export default {
    name: 'SatffForm',
    components: {
    },
    props: {
      //表单禁用
      disabled: {
        type: Boolean,
        default: false,
        required: false
      }
    },
    data () {
      return {
        openTypeAdd: false,//新增窗口
        openTypeEntry: false,//确认到岗
        openTypeFormal: false,//办理转正
        openTypeFormalTime: false,//调整转正时间
        model:{
          entryStatus: 0,
         },
        labelCol: {
          xs: { span: 24 },
          sm: { span: 5 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 16 },
        },
        confirmLoading: false,
        validatorRules: {
           staffName: [
              { required: true, message: '请输入姓名!'},
           ],
           staffPhone: [
              { required: true, message: '请输入手机号!'},
           ],
           planEntryTime: [
              { required: true, message: '请输入预计入职时间!'},
           ],
          staffDepartmentIds:[
            { required: false, message: '请选择部门!'},
          ],
          entryTime:[
            { required: true, message: '请选择入职时间!'},
          ],
          staffJob:[
            { required: false, message: '请输入职位!'},
          ],
          staffType:[
            { required: true, message: '请选员工类型!'},
          ],
          entryStatus:[
            { required: true, message: '请选择员工状态!'},
          ],
          staffTrialType:[
            { required: true, message: '请选择试用期!'},
          ]
          ,
          planFormalTime:[
            { required: true, message: '请选择计划转正时间!'},
          ],
          realFormalTime:[
            { required: true, message: '请选择实际转正时间!'},
          ]
        },
        url: {
          add: "/satff/satff/add",
          edit: "/satff/satff/edit",
          queryById: "/satff/satff/queryById"
        }
      }
    },
    computed: {
      formDisabled(){
        return this.disabled
      },
    },
    created () {
       //备份model原始值
      this.modelDefault = JSON.parse(JSON.stringify(this.model));
    },
    methods: {
      staffTrialChange(val){
        if (!this.model.entryTime) {
          this.model.planFormalTime = "";
          return;
        }
        let newDate = new Date(this.model.entryTime);
        newDate.setMonth( newDate.getMonth()+ parseInt(this.model.staffTrialType)-1);

        this.model.planFormalTime = dateFormat(newDate,"yyyy-MM-dd");
      },
      add () {
        this.model = Object.assign({}, this.modelDefault);
        this.visible = true;
        this.openTypeAdd = true;
      },
      openEntry (record) {
        this.model = Object.assign({}, record);
        this.model.entryStatus = null;
        this.visible = true;
        this.openTypeEntry = true;
        this.validatorRules.staffDepartmentIds[0].required = true;
        this.validatorRules.staffJob[0].required = true;
      },
      formal (record) {
        this.model = Object.assign({}, record);
        this.visible = true;
        this.openTypeFormal = true;
      },
      formalTime (record) {
        this.model = Object.assign({}, record);
        this.visible = true;
        this.openTypeFormalTime = true;
      },
      submitForm () {
        const that = this;
        // 触发表单验证
        this.$refs.form.validate(valid => {
          if (valid) {
            that.confirmLoading = true;
            let httpurl = '';
            let method = '';
            if(!this.model.id){
              httpurl+=this.url.add;
              method = 'post';
              this.model.entryOrigin = 1;
            }else{
              httpurl+=this.url.edit;
               method = 'put';
            }
            httpAction(httpurl,this.model,method).then((res)=>{
              if(res.success){
                that.$message.success(res.message);
                that.$emit('ok');
              }else{
                that.$message.warning(res.message);
              }
            }).finally(() => {
              that.confirmLoading = false;
            });
          }

        })
      },
    }
  }
</script>